@import plugins.Context
@import org.silkframework.learning.LearningActivity
@import controllers.rules.routes.Assets
@import org.silkframework.rule.LinkSpec
@import views.html.workspace.activity.taskActivityControl

@(context: Context[LinkSpec])(implicit session: play.api.mvc.Session)

@header = {
  <link type="text/css" href="@Assets.at("stylesheets/table.css")" rel="stylesheet" />
  <link type="text/css" href="@Assets.at("stylesheets/pagination.css")" rel="stylesheet" />
  <link type="text/css" href="@Assets.at("stylesheets/links.css")" rel="stylesheet" />
  <link rel="stylesheet" href="@Assets.at("stylesheets/treeview/jquery.treeview.css")" type="text/css" />
  <link type="text/css" href="@Assets.at("stylesheets/linkageRuleTree.css")" rel="stylesheet" />
  
  <script src="@Assets.at("js/jquery.pagination.js")" type="text/javascript"></script>
  <script src="@Assets.at("js/jquery.treeview.js")" type="text/javascript"></script>
  <script src="@Assets.at("js/links.js")" type="text/javascript"></script>

  <script type="text/javascript">
    function back() {
      //TODO stop current task
      window.location = "@config.baseUrl/linking/@context.project.name/@context.task.id/learnStart"
    }

    function next() {
      //TODO stop current task
      window.location = "@config.baseUrl/linking/@context.project.name/@context.task.id/learn/population"
    }
  </script>
}

@toolbar = {
  <ul>
    <li>
      <button class="mdl-button mdl-js-button mdl-button--raised" onclick="back()">Back</button>
    </li>
    <li>
      <button class="mdl-button mdl-js-button mdl-button--raised" onclick="next()">Next</button>
    </li>
    <li>
      @taskActivityControl(context.task.activity[LearningActivity])
    </li>
  </ul>
}

@content = {
  <div class="wrapper-header">
    Learned Linkage Rule
  </div>
		
  <div class="wrapper">
    @widgets.autoReload("learn/rule", "learn/ruleStream")
  </div>
}

@main(Some(context))(header)(toolbar)(content)